<template>
  <a-card :bordered="false">
    <a-tabs default-active-key="1" tab-position="left" @tabClick="go2url">
      <a-tab-pane v-for="item in tabItems" :key="item.id" :tab="item.name">
        <div v-if="item.isUrl && !item.isOut">
          <iframe
            v-if="!item.toOut"
            :id="item.id"
            :src="item.url"
            frameborder="0"
            width="100%"
            height="950px"
            scrolling="auto"
          ></iframe>
        </div>
        <div v-else-if="item.isUrl && item.isOut">
          <div v-show="loginCode">
            <a-card :bordered="false">
              <a-alert message="当前已为您打开外部链接" type="success" show-icon style="margin-bottom: 10px">
                <div slot="description">
                  请查看新打开的外部链接页面；若需重新打开，<a :href="item.Url" target="_blank" style="color: #0c8fcf"
                    >请点击此处</a
                  >
                </div>
              </a-alert>
            </a-card>
          </div>
          <div v-show="!loginCode">
            <a-card :bordered="false">
              <a-alert
                message="您暂时不能访问该页面"
                description="因该账户缺少访问该页面的重要字段，请联系管理员解决。"
                type="error"
                show-icon
                style="margin-bottom: 10px"
              />
            </a-card>
          </div>
        </div>
        <div v-else-if="!item.isUrl">
          <monthlyIndex v-if="item.content == 'monthlyIndex'"></monthlyIndex>
          <annualTarget v-if="item.content == 'annualTarget'"></annualTarget>
        </div>
      </a-tab-pane>
    </a-tabs>
  </a-card>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import Vue from 'vue'
import { USER_INFO } from '../../store/mutation-types'
import monthlyIndex from '@views/dataVisualization/components/monthlyIndex'
import annualTarget from '@views/dataVisualization/annualTarget'

export default {
  name: 'workbench',
  mixins: [JeecgListMixin],
  components: {
    monthlyIndex,
    annualTarget,
  },
  data() {
    return {
      tabItems: [
        {
          name: '年度目标进展情况',
          id: '1',
          isUrl: false, // 如果是链接,则为true
          content: 'annualTarget',
        },
        {
          name: '月度监测预警情况',
          id: '2',
          isUrl: false,
          content: 'monthlyIndex',
        },
        {
          name: '自评材料情况上传',
          id: '3',
          isUrl: true,
          isOut: false, // 如果需要跳转外部,则为true
          url: 'http://10.107.99.181/eaWorkValue/eaPatch/workPatch?username=' + Vue.ls.get(USER_INFO).realname,
        },
        // { name: '重点目标进展', id: '4', isUrl: false },
      ],
      name: '',
      loginCode: '',
    }
  },
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    },
  },
  mounted() {
    this.name = Vue.ls.get(USER_INFO).realname
    this.loginCode = Vue.ls.get(USER_INFO).avatar
  },
  methods: {
    go2url(val) {
      // if (val == '2' && this.loginCode) {
      //   let params = Vue.ls.get(USER_INFO).avatar
      //   let outUrl = this.tabItems[1].url + params
      //   //  打开新建页面
      //   window.open(outUrl)
      // }
    },
  },
}
</script>
<style scoped lang="stylus">
@import '~@assets/less/common.less';

/deep/ .ant-card-body {
  padding: 24px 0;
}
</style>
